<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport"    content="width=device-width, initial-scale=1.0">
	<meta name="author"      content="youyax">
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
		<script src="./xlert.js" type="text/javascript"></script>
		<title>xlert弹框插件</title>
	</head>
	<body>
		<center>
			<h1>xlert弹框插件</h1>
			<h3>（狄默默斯基作品）描述</h3>
			<p>用于代替系统自带alert的解决方案</p>
			<div style="width:100%;text-align:left;">
				<h3>网站引用方式</h3>
				<pre class="brush: javascript"><script src="./xlert.js" type="text/javascript"></script></pre>
				<h3>配置参数演示</h3>
				<p>带回调函数，格式为JSON字符串
					<pre class="brush: javascript"> 
			xlert({
					content:'<span style="color:#ff0000;">错误提示</span> <br> 内容不能为空!',
					pos:2, //1、警告，2、错误，3、正确，4、疑问
					callback:function(){
						alert('回调原来的alert');
					},
				});</pre><input type="button" value='运行' onclick="runall()"></p>
				<p>简易参数，格式为2个字符串参数
					<pre class="brush: javascript"> 
			xlert('恭喜，注册成功！',3);	</pre><input type="button" value='运行' onclick="run()"></p>
			<p>默认错误型，格式为1个字符串参数
					<pre class="brush: javascript"> 
			xlert('操作错误！');	</pre><input type="button" value='运行' onclick="runerror()"></p>
				<p>iframe嵌套页面
					<pre class="brush: javascript"> 
			xlert({
				title:"京东商城",
				width:"500",
				height:"400",
				src:"https://m.jd.com/"
				});</pre><input type="button" value='运行' onclick="runiframe()"></p>
				<p>confirm信息
					<pre class="brush: javascript"> 
			xlert({
					confirm:{
						title:"提示信息",
						content:"确定删除这条信息吗？",
						okfun:function(){
							xlert('恭喜，删除成功!',3);	
						},
						ccfun:function(){
							xlert('错误，已取消!',2);	
						}
					}
				});</pre><input type="button" value='运行' onclick="runconfirm()"></p>
				<p>loading等待
					<pre class="brush: javascript"> 
			var index = xlert({loading:true});
			setTimeout(function(){
				xlert({loading:{close:index}});
			},3000);</pre><input type="button" value='运行' onclick="runloadding()"></p>
			<p>提示层
					<pre class="brush: javascript"> 
			var index = xlert({msg:'数据加载中…'});
			setTimeout(function(){
				xlert({msg:{close:index}});
			},3000);</pre><input type="button" value='运行' onclick="runmsg()"></p>
			</div>
		</center>		
	<script>
	function runall(){
				xlert({
					content:'<span style="color:#ff0000;">错误提示</span> <br> 内容不能为空!',
					pos:2, //1、警告，2、错误，3、正确，4、疑问
					callback:function(){
						alert('回调原来的alert');
					},
				});
		}function run(){
			xlert('恭喜，注册成功！',3);	
		}function runerror(){
			xlert('操作错误！');	
		}
	function runiframe(){
				xlert({
				title:"京东商城",
				width:"500",
				height:"400",
				src:"https://m.jd.com/"
				});
		}
		function runconfirm(){
				xlert({
					confirm:{
						title:"提示信息",
						content:"确定删除这条信息吗？",
						okfun:function(){
							xlert('恭喜，删除成功!',3);	
						},
						ccfun:function(){
							xlert('错误，已取消!',2);	
						}
					}
				});
		}
		function runloadding(){
			var index = xlert({loading:true});
			setTimeout(function(){
				xlert({loading:{close:index}});
			},3000);
		}
		function runmsg(){
			var index = xlert({msg:'数据加载中…'});
			setTimeout(function(){
				xlert({msg:{close:index}});
			},3000);
		}
	</script>
	<h3>下载地址：</h3>
	<a target="_blank" href="https://gitee.com/youyax/xlert">https://gitee.com/youyax/xlert</a>
	</body>
</html>
		